<template>
  <div>
   <HeaderTop v-bind:activeIndex="activeIndex"></HeaderTop>
<!--    公告面板-->
    <el-row type="flex" justify="center" >
      <el-col :span="18">
        <el-collapse accordion>
          <el-collapse-item class="advice_item" v-for="a in adviceList">
            <template slot="title">
              <div style="font-size: 24px;width: 1200px">
                <i class="iconfont icon-gonggao3" style="font-size: 24px;color: #f1da7f"></i>&nbsp;&nbsp;&nbsp;{{a.title}} <span v-if="a.weight==1" style="color: red">(置顶)</span>  <span style="display: inline-block;margin-left:60px;float: right">{{a.publishTime}}</span>
              </div>
            </template>
            <div v-html="a.body.contenthtml"></div>
          </el-collapse-item>
        </el-collapse>
      </el-col>
    </el-row>

  </div>
</template>

<script>
import HeaderTop from "@/components/HeaderTop";
export default {
  name: "AdviceCenter",
  components:{HeaderTop},
  data(){
    return {
      activeIndex:'100',
      adviceList:[],
    }
  },
  methods:{
    getAdvices(){
      let url = 'advice/getAll'
      this.$axios.get(url)
          .then(res=>{
            if(res.data.code == 200){
              this.adviceList = res.data.data;
            }
          })
    },
  },

  created() {
    this.getAdvices();
  }
}
</script>

<style scoped>
/deep/ .el-collapse-item__header {
  display: flex;
  align-items: center;
  height: 80px;
  line-height: 20px;
  padding: 0 5px;
  background-color: transparent;
  cursor: pointer;
  font-size: 16px;
  font-weight: 500;
  transition: border-bottom-color .3s;
  outline: none;
}

/deep/ .el-collapse-item__content {
  padding-bottom: 10px;
  padding-left: 5px;
  font-size: 13px;
  line-height: 1.769230769230769;
}
</style>